<template>
	<view class="safetyStatement">
		<u-navbar 
			title="进件查询" 
			left-text="" 
			right-text="筛选" 
			@leftClick="onClickBack" 
			@rightClick="onClickRight"
			:placeholder="true"
			:fixed="true"
			:safeAreaInsetTop="true"
			class="nav"
		></u-navbar>
		<u-popup :show="filterTimer" @close="closeFilterTimer" mode="top" :safeAreaInsetTop="true">
			<view class="filterTimer">
				
				<view class="filterContent">
					<view class="w-flex w-flex-between">
						<view class="startTime" @click="showTime = true" :style="showCurrStartTime !== '请选择日期'?'color:#000;font-size:14px;':''">
							<text>{{showCurrStartTime}}</text>
							<u-icon name="arrow-down" color="#b3b3b3" size="14"></u-icon>
						</view>
						<text style="margin: 0 10px;">至</text>
						<view class="startTime" @click="showEndTime = true" :style="showCurrEndTime !== '请选择日期'?'color:#000;font-size:14px;':''">
							<text>{{showCurrEndTime}}</text>
							<u-icon name="arrow-down" color="#b3b3b3" size="14"></u-icon>
						</view>
					</view>
					<view>
						<u-datetime-picker
							:show="showTime"
							:value="startTime"
							mode="date"
							@cancel="cancel"
							@confirm="confirmTime"
							:maxDate="maxDate"
							:formatter="formatter"
						></u-datetime-picker>
						<u-datetime-picker
							:show="showEndTime"
							:value="endTime"
							mode="date"
							@cancel="cancelEndTime"
							@confirm="confirmEndTime"
							:maxDate="maxDate"
							:formatter="formatter"
						></u-datetime-picker>
					</view>
					<view class="w-flex w-flex-between w-mt-15 timerChoice">
						<text class="dateStyle" :class="activeDate === 0?'activeDate':''" @click="timerToday">今日</text>
						<text class="dateStyle" :class="activeDate === 1?'activeDate':''" @click="timerWeek">近一周</text>
						<text class="dateStyle" :class="activeDate === 2?'activeDate':''" @click="timerMonth">近一月</text>
					</view>
				</view>
				<view class="w-flex w-flex-between w-mt-20 bottomBtn">
					<text class="txtBtn" @click="closeFilterTimer">取消</text>
					<text class="txtBtn" style="color: #1678ff;" @click="dateFilter">确定</text>
				</view>
			</view>
		</u-popup>
		<view class="content">
			<view>
				<view class="cu-list menu-avatar">
					<view class="cu-item cur" v-for="(item, index) in listData" :key="index">
						<view class="cu-avatar radius lg">
							<view>
								<u-avatar :src="item.doorPic?item.doorPic:'../../static/icon/icon_xw.png'" size="48" shape="square" @click="detail(item.id, item.les_status, item.merchantName)"></u-avatar>
							</view>
						</view>
						<view class="content" @click="detail(item.id, item.les_status, item.merchantName)">
							<view>
								<view class="text-cut">{{item.merchantName}}</view>
							</view>
							<view class="text-gray text-sm flex">
								<view class="text-cut">
									<text>{{format(item.createtime*1000) || 0}}</text>
								</view>
							</view>
						</view>
						<view class="action" style="width: auto;font-size: 12px;">
							<view class="text-grey w-flex" v-if="item.les_status === '3'">
								<text>待进件</text>
								<!-- <text class="lg text-gray cuIcon-right w-ml-10"></text> -->
							</view>
							<view class="main-color w-flex" v-else-if="item.les_status === '1'">
								<text>待审核</text>
								<!-- <text class="lg text-gray cuIcon-right w-ml-10"></text> -->
							</view>
							<view class="main-color w-flex" v-else-if="item.les_status === '2'">
								
								<!-- <view v-if="item.wx_qrcodeurl" @click="wechatQuery(item.id)">
									<text>微信待认证</text>
								</view> -->
								<view >
									已审核
								</view>
							</view>
							<view class="main-color w-flex" v-else-if="item.les_status === '5'">
								<text>审核失败</text>
								<!-- <text class="lg text-gray cuIcon-right w-ml-10"></text> -->
							</view>
						</view>
					</view>
				</view>
			</view>
			<view class="" v-if="listData.length === 0">
				<u-empty
					mode="data"
					icon="http://cdn.uviewui.com/uview/empty/data.png"
				>
				</u-empty>
			</view>
		</view>
		<u-modal :show="wechatDialog" :title="wechatTitle"
		:closeOnClickOverlay="true"
		@close="hidewechatDialog"
		@confirm="wechatDialogConfirm"
		confirmText="保存到手机">
			<view class="slot-content">
				<u--image :src="wechatDialogContent" width="300rpx" height="300rpx"></u--image>
			</view>
		</u-modal>
		<u-toast ref="uToast"></u-toast>
		<u-loadmore :status="status" class="w-pb-10" v-if="listData.length >= 10"/>
	</view>
</template>

<script>
import {format, getPreMonth} from  "@/util/common.js"
export default {
	data() {
		return {
			format,
			listData: [],
			filterTimer: false,
			showTime: false,
			showEndTime: false,
			startTime: Number(new Date().getTime() - 3600 * 1000 * 24 * 31),
			endTime: Number(new Date()),
			maxDate: Number(new Date()),
			activeDate: 2,
			showCurrEndTime: '请选择日期',
			showCurrStartTime: '请选择日期',
			type: '',
			wechatDialog: false,
			wechatDialogContent: 'https://cdn.uviewui.com/uview/album/1.jpg',
			wechatTitle: '',
			status: 'loadmore',
			page: 1,
			closeRequest: false
		}
	},
	onShow() {
		
	},
	onReachBottom () {
		
		if (this.listData.length >= 10) {
			this.status = 'loading';
			this.page = ++ this.page;
			setTimeout(() => {
				this.initDataList(this.page)
				if (this.closeRequest) this.status = 'nomore';
				else this.status = 'loading';
			}, 1500)
			
		}
		
	},
	onLoad(e) {
		this.type = e.shopMenu
		this.initDataList(this.page)
		this.showCurrStartTime = getPreMonth(1);
		this.showCurrEndTime = this.formatTimer(Number(new Date()));
	},
	methods: {
		async initDataList (page) {
			if (this.closeRequest) {
				this.$refs.uToast.show({
					type: 'default',
					title: '默认主题',
					message: "没有更多了",
				})
				this.status = 'nomore'
				return
			}
			let params = {
				agentid: uni.getStorageSync("YNF_INFO").user_id,
				leshuastatus: Number(this.type),
				start_time: this.showCurrStartTime === '请选择日期'?'':this.showCurrStartTime + ' '+ '00:00:00',
				end_time: this.showCurrEndTime === '请选择日期'?'':this.showCurrEndTime + ' '+ '23:59:59',
				page: page,
				size: 10
			}
			const res = await this.$API({url: '/api/index/user_agent_list', method:"GET", data: params})
			if (res.code === 1) {
				
				if (res.data.length > 0) {
					for (let item of res.data) {
						this.listData.push(item)
					}
					this.status = 'loadmore'
				} else {
					if (page > 1) {
						this.status = 'nomore'
						this.$refs.uToast.show({
							type: 'default',
							title: '默认主题',
							message: "没有更多了",
						})
						this.closeRequest = true
					}
					
				}
				
			}
		},
		
		// 返回页面
		onClickBack () {
			uni.navigateBack()
		},
		// 筛选日期
		onClickRight(){
			this.filterTimer = true
			// uni.navigateTo({
			// 	url: '/pages/screeningConditions/screeningConditions'
			// })
		},
		async wechatQuery (id) {
			let params = {
				user_id: id
			}
			const res = await this.$API({url: '/api/user/wechat_query', method:"GET", data: params})
			if (res.code === 1) {
				this.wechatDialog = true
				this.wechatDialogContent = res.data
				this.wechatTitle = res.msg
			}
			
		},
		detail (id, status, name) {
			// if(status === '2') {
			// 	return
			// }
			uni.navigateTo({
				url: '/pages/addParts/MerchantForm?id='+ id+'&status='+status+'&name='+ name
			})
		},
		cancel () {
			this.showTime = false
		},
		cancelEndTime () {
			this.showEndTime = false
		},
		confirmEndTime (date) {
			this.showEndTime = false
			this.showCurrEndTime = this.formatTimer(date.value)
		},
		confirmTime (date) {
			this.showCurrStartTime = this.formatTimer(date.value)
			this.showTime = false
		},
		formatter(type, value) {
			if (type === 'year') {
					return `${value}年`
			}
			if (type === 'month') {
					return `${value}月`
			}
			if (type === 'day') {
					return `${value}日`
			}
			return value
		},
		formatTimer(time, type) {
			var time = new Date(time);
			var y = time.getFullYear();
			var m = time.getMonth()+1;
			var d = time.getDate();
			var h = time.getHours();
			var mm = time.getMinutes();
			var s = time.getSeconds();
			if (type === 'YMD') {
				return y+'年'+this.add0(m)+'月'+this.add0(d)+'日';
			}
			return y+'-'+this.add0(m)+'-'+this.add0(d);
		},
		add0(m){return m<10?'0'+m:m },
		timerToday () {
			this.showCurrStartTime = this.formatTimer(Number(new Date()));
			this.showCurrEndTime = this.formatTimer(Number(new Date()));
			this.timerType = 0
			this.activeDate = 0
		},
		timerWeek () {
			this.showCurrStartTime = this.formatTimer(Number(new Date().getTime() - 3600 * 1000 * 24 * 7));
			this.showCurrEndTime = this.formatTimer(Number(new Date()));
			this.timerType = 1
			this.activeDate = 1
		},
		timerMonth () {
			this.showCurrStartTime = getPreMonth(1);
			this.showCurrEndTime = this.formatTimer(Number(new Date()));
			this.timerType = 2
			this.activeDate = 2
		},
		closeFilterTimer () {
			this.filterTimer = false
		},
		async dateFilter () {
			this.filterTimer = false
			this.page = 1
			this.listData = []
			this.closeRequest = false
			this.initDataList(this.page)
		},
		hidewechatDialog () {
			this.wechatDialog = false
		},
		wechatDialogConfirm () {
			
			const _this = this
			uni.downloadFile({
				url: _this.wechatDialogContent,
				success: res => {
					if (res.statusCode === 200) {
						uni.saveImageToPhotosAlbum({
							filePath: res.tempFilePath,
							success: ()=> {
								
								_this.$refs.uToast.show({
									message: "保存成功"
								})
							},
							fail: ()=> {
								_this.$refs.uToast.show({
									message: "保存失败，请稍后重试",
								})
							},
							complete: ()=> {
								_this.wechatDialog = false
							}
						});
					} else {
						_this.$refs.uToast.show({
							message: "下载失败",
						})
					}
				}
			});
		}
	}
}
</script>

<style lang="scss" scoped>
.safetyStatement {
	
	.content {
		padding-top: 20rpx;
	}
	.filterTimer {
		background: #FFFFFF;
		
		.filterContent {
			padding: 20rpx 30rpx;
		}
		.startTime {
			background: #F1F1F1;
			display: flex;
			align-items: center;
			justify-content: center;
			color: #b3b3b3;
			padding: 0 20rpx;
			width: 320rpx;
			height: 60rpx;
			border-radius: 10rpx;
			font-size: 12px;
			display: flex;
			align-items: center;
			justify-content: space-between;
		}
	}
}

</style>
